import React, { useEffect, useState } from 'react';
import _ from 'lodash';

const Obj = { name: '马云', age: 20, school: '武汉养猪科技学院' };
const Arr = [
    { name: '马云', age: 20 },
    { name: '钟南山', age: 18 },
    { name: '马化腾', age: 34 },
    // { name: '钟南山', age: 18 },
];

// const arrName = ['马云', '钟南山', '马化腾'];
const arrAge = [{ '马云': 20 }, { '马化腾': 34 }, { '钟南山': 18 }];

const ArrNumber = [2, 5, 8, 2, 4];

const ArrZ = [];

export default () => {

    const [value, setValue] = useState('');

    useEffect(() => {
        // 1、
        // const arr1 = Object.keys(Obj);
        // const res1 = arr1.map(value => {
        //     return Obj[value];
        // });
        // console.log(res1.join(','));

        // 1、简写版
        // 将对象遍历取得数组下标：Object.keys(obj)=>[]
        // 对数组遍历，map输出的结果需要自己设定，但是一定会输出数组长度的个数是一直的
        // join作用：是将数组转化为字符串，接受一个参数：','-->连接符
        // setValue(Object.keys(Obj).map(i=>Obj[i]).join(','));

        // 2、
        // const Arr = [
        //     { name: '马云', age: 20 },
        //     { name: '钟南山', age: 18 },
        //     { name: '马化腾', age: 34 },
        //     // { name: '钟南山', age: 18 },
        // ];

        // setValue(Arr.map(i=>i.name).join(','))

        // 3、数字排序
        // const ArrNumber = [2, 5, 8, 2, 4];
        // setValue(ArrNumber.sort((a, b) => b - a));
        // 去重
        // setValue(_.uniq(ArrNumber));


        // 4、数据排序
        // const Arr = [
        //     { name: '马云', age: 20 },
        //     { name: '钟南山', age: 18 },
        //     { name: '马化腾', age: 34 },
        //     // { name: '钟南山', age: 18 },
        // ];
        // setValue(Arr.sort((a, b) => b.age - a.age));
        // 去重
        // setValue(_.uniqBy(Arr, 'age'))

        // 5、手动去重
        // indexOf:判断数组或者字符串是否含有某个特定值，若有，返回当前值得下标；没找到返回-1
        // const ArrNumber = [2, 5, 8, 2, 4];  // 2 2 4 5 8
        // const newArr = [];
        // ArrNumber.map((v) => {
        //     if (newArr.indexOf(v) === -1){
        //         newArr.push(v);
        //     }
        // })
        // ArrNumber.map((v) => {
        //     if (!newArr.includes(v)){
        //         newArr.push(v);
        //     }gt
        // })

        // ArrNumber.sort().map((value, index, arr) => {
        //     if (value !== arr[index + 1]){
        //         newArr.push(value);
        //     }
        // })

        // 数组 --查

        // const ArrNumber = [2, 5, 8, 2, 4]; 


        // setValue(ArrNumber.shift()); // 查第一个
        // setValue(ArrNumber.pop()); // 查最后一个

        // ArrNumber.shift();
        // setValue(ArrNumber); // 取出最后四个

        // splice(a,b,c)
        // a:代表查询或者删除的初始位置【下标】
        // b:代表删除值得个数
        // setValue(ArrNumber.splice(1,1)) // 查指定位置
        // ArrNumber.splice(0,0,1,1) // 添加
        // ArrNumber.splice(2,1,1) // 替换
        // setValue(ArrNumber) 

        const a = [3, 2, 1];
        const b = [4, 2];

        // filter:它也是一个循环的的函数，但是它是筛选，map()返回肯定和之前数组的长度相同
        const newdata = a.filter(i => {
            if (!b.includes(i)) return i;
        })
        setValue(newdata);

    }, []);

    return (
        <div>
            <pre>{JSON.stringify(value, null, 2)}</pre>
        </div>
    )
}